import { Card } from 'antd';
import React from 'react';
import Link from 'components/ZLink'
export default () => {

    /** 返回值 */
    React.useEffect(() => {
        function fn() {
            const result = 'result'
            return function () {
                return result
            }
        }
        let result: any = fn()()
        console.log(result)
        return () => {
            result = null
        }
    }, [])

    /** 函数赋值 */
    React.useEffect(() => {
        let fn2: any
        function fn() {
            const name = 'hellow'
            fn2 = function () {
                return name
            }
        }
        fn()
        console.log(fn2())
    }, [])

    /** 函数参数 */
    React.useEffect(() => {
        function fn() {
            const name = 'hello'
            return function () {
                return name
            }
        }
        const fn1 = fn()
        function test(func: any) {
            console.log(func())
        }
        test(fn1)
    }, [])

    /** 自执行函数 */
    React.useEffect(() => {
        (function () {
            const name = 'hello'
            const f1 = function () {
                return name
            }
            f2(f1)
        })()
        function f2(cb: any) {
            console.log(cb())
        }
    }, [])

    /** 循环赋值 */
    React.useEffect(() => {
        for (let i = 0; i <= 10; i++) {
            (function (j) {
                setTimeout(() => {
                    console.log(j)
                }, j * 1000)
            })(i)
        }
    }, [])

    /** getter和setter */
    React.useEffect(() => {
        function fn() {
            let name = 'hellow'
            let setName = function (value: string) {
                name = value
            }
            let getName = function () {
                return name
            }
            return {
                setName,
                getName
            }
        }
        const test = fn()
        console.log(test.getName())
        test.setName('why')
        console.log(test.getName())
    }, [])
    return (
        <div>
            <Card
                title="相关链接"
            >
                <Link href="https://mp.weixin.qq.com/s/bJL9r2h5xvjKerqfx9Vwgg" label="闭包的 9 个常用场景" />
            </Card>
        </div>
    )
}